<!--
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1">
    <link href="css/bootstrap.min.css" rel="stylesheet"/>
    <link href="css/indexyanshi.css" rel="stylesheet"/>
    <script src="js/jquery-3.4.1.js"></script>
    <script type="text/javascript" src="js/bootstrap.min.js"></script>

    <title>Title</title>

    <style type="text/css">

        #more{
            width: 650px;
            height: 360px;
            text-align: center;
            background-color: white;
            position: absolute;
            top: 50%;
            left: 50%;
            border-radius: 20px;
            transform: translate(-50%,-50%);
            z-index: 15;
        }


        #moreDiv a{
            width: 120px;
            display: inline-block;
            font-family: "微软雅黑";
            font-size:18px;
            text-align: center;

        }
        .selectedColor{
            color: red !important;
            font-weight:bold !important;
        }

        #seek_form{
            transform: translateX(-50%);
            left:50%;
            padding-top: 60px;
            position:absolute;
            display: inline-block;
        }

        #seekEditText{
            width: 400px;
            height: 40px;
        }

        #seekBtn{
            width: 100px;
            height: 40px;
        }

        .layout{
            height: 300px;
            position: relative;
        }

        #logoId{
            width: 60px;
            height: 60px;
        }

        #carouselDiv{
            background-color: white;
            position: absolute;
            height: 260px;
            width: 840px;
            right: 50%;
            transform: translateX(50%);
            top: 250px;
            border-top-right-radius: 10px;
            border-top-left-radius: 10px;
            border-bottom-right-radius:10px;
            border-bottom-left-radius:10px;
            box-shadow:5px 5px 10px #000;
        }


        .leftFont{
                     font-size: 20px;
                     color: #0f0f0f;
                     margin-left: 30px;
                 }

        #myCarousel  .carousel-inner > .item > img {
            display: inline-block;
            width:700px;
            margin-top: 15px;
        }

        #leftMenu{
            display: inline-block;
            width: 100px;
        }

        #leftMenu button {
            margin-bottom: 23px;
            height: 40px;
            width: 80px;
        }

        #others{
            position: absolute;
            left: 98px;
            height: 50px;
            background-color: white;
            display: none;
            z-index: 1000;
        }

        #others  td select{
            transform: translate(10%, 70%);
            width: 70px;
            margin-right: 20px;
        }

        #shoppingDomain{
            position: relative;
            top: 250px;
        }

        #pageId{
            position: relative;
            top: 250px;
        }


    </style>

    <script >

        window.onload=function(){
            var oLeft=document.getElementById("left");
            var oRight=document.getElementById("right");
            var oCloseX=document.getElementById("x");
            var oCloseY=document.getElementById("y");
            var scrollY=document.documentElement.scrollTop||document.body.scrollTop;
            var clientH=document.documentElement.clientHeight||document.body.clientHeight;
            var topBtn=document.getElementById('btn');
            var time;//定时器对象
            if(oCloseX)
                oCloseX.onclick=function(){
                    this.parentNode.parentNode.removeChild(this.parentNode);
                }
            if(oCloseX)
                oCloseY.onclick=function(){
                    this.parentNode.parentNode.removeChild(this.parentNode);
                }
            if(oLeft)
                oLeft.style.top=(clientH-oLeft.offsetHeight)/2+scrollY+"px";
            if(oRight)
                oRight.style.top=(clientH-oRight.offsetHeight)/2+scrollY+"px";
            window.onscroll=function(){
                scrollY=document.documentElement.scrollTop||document.body.scrollTop;
                clientH=document.documentElement.clientHeight||document.body.clientHeight;
                if(scrollY>=clientH)
                    topBtn.style.display="block";
                else
                    topBtn.style.display="none";
                if(oLeft)
                    oLeft.style.top=(clientH-oLeft.offsetHeight)/2+scrollY+"px";
                if(oRight)
                    oRight.style.top=(clientH-oRight.offsetHeight)/2+scrollY+"px";
            }
            topBtn.onclick=function(){
                time=setInterval(function(){
                    var speed=Math.floor(-scrollY/8);
                    document.documentElement.scrollTop=document.body.scrollTop=scrollY+speed;
                    if(scrollY==0)
                        clearInterval(time);
                },10);
            }
        }
        var carBrand = null;
        var money = null;
        var carType = null;

        var title = null;

        var age = null;
        var km = null;
        var standard = null;
        var displacement = null;
        var gearbox = null;
        var country = null;
        var colour = null;
        var capabilities = null;

        var $carBrandSelected = null;
        var $moneySelected = null;
        var $carTypeSelected = null;

        var currentPage = 1;

        /*
         * 读取参数的值
         */
        function getParameter(name){
            var reg = new RegExp("(^|&)"+name+"=([^&]*)(&|$)","i");
            var r = location.search.substr(1).match(reg);
            if(r!=null) return (r[2]);
            return null;
        }

        $(function(){

            $("#seekBtn").click(function(){
                title = $("#seekEditText").val();
                execute();
                return false;
            });

            /*
                是否登录
            */
            $.ajax({
                // 编写json格式，设置属性和值
                url:"user/findUser",
                contentType:"application/json;charset=UTF-8",
                data:'',
                dataType:"json",
                type:"post",
                success:function(data){
                    if(!data.phone){
                        $("#dis1")[0].style.display="block";
                        $("#dis2")[0].style.display="block";
                        $("#dis3")[0].style.display="none";
                    }else{
                        $("#dis1")[0].style.display="none";
                        $("#dis2")[0].style.display="none";
                        $("#dis3")[0].style.display="block";
                    }
                }
            })

            var othersFlag = false;
            $("#showOthers").click(function(){
                if(othersFlag == false){
                    othersFlag = true;
                    $("#others")[0].style.display = "block";
                }else{
                    othersFlag = false;
                    $("#others")[0].style.display = "none";
                }
            })


            /*
                相关的category
            */
            $.ajax({
                // 编写json格式，设置属性和值
                url:"category/beanBTC",
                contentType:"application/json;charset=UTF-8",
                data:'',
                dataType:"json",
                type:"post",
                success:function(data){
                    if(!data){
                        alert("网络延迟，请刷新！")
                    }else{
                        var brand = $("#brand");
                        var type = $("#type");
                        var category = $("#category");



                        for(var i = 0;i<7;i++){
                            brand.append("<li><a class='shownone' name="+i+">"+data.cateBrands[i].name+"</a></li>")
                        }
                        //brand.append("<td ><a id='moreId'>更多</a></td>");
                        brand.append("<li role='separator' class='divider'></li><li><a id='moreId' >更多</a></li>")
                        $("#moreId").click(function(){
                            $("#more")[0].style.display="block";
                        })
                        for(var i = 0;i<data.cateBrands.length;i++){

                            $("#moreDiv").append("<a class='shownone' name="+i+" >" + data.cateBrands[i].name + "</a>");

                            if(i==data.cateBrands.length-1){
                                $("#moreDiv").append("<a class='shownone' >恢复默认</a>");
                            }
                        }

                        $(".shownone").click(function(){
                            $("#more")[0].style.display="none";

                            if($(this).html()==="恢复默认"){
                                carBrand = null;
                                if($carBrandSelected != null){
                                    var val=$carBrandSelected.attr("name");
                                    $("#carouselDiv a[name = "+val+"]").removeClass("selectedColor");
                                }
                                $carBrandSelected = null;
                                execute();
                                return;
                            }


                            if($carBrandSelected != null){
                                var val=$carBrandSelected.attr("name");
                                $("#carouselDiv a[name = "+val+"]").removeClass("selectedColor");

                            }
                            if($carBrandSelected ==null || $carBrandSelected.html() != $(this).html()){
                                $carBrandSelected = $(this);
                                var val=$carBrandSelected.attr("name");
                                $("#carouselDiv a[name = "+val+"]").addClass("selectedColor");
                                carBrand = $(this).html();
                            }else{
                                $carBrandSelected = null;
                                carBrand = null;
                            }
                            //调用查询方法
                            execute();
                        });


                        for(var i = 0;i<data.carTypes.length;i++){
                            //type.append("<td ><a class='showtype'>"+data.carTypes[i].name+"</a></td>");
                            type.append("<li><a class='showtype'>"+data.carTypes[i].name+"</a></li>")
                        }

                        $(".showtype").click(function(){

                            if($carTypeSelected != null){
                                $carTypeSelected.removeClass("selectedColor");
                            }
                            if($carTypeSelected == null || $carTypeSelected.html() != $(this).html()){
                                $carTypeSelected = $(this);
                                $carTypeSelected.addClass("selectedColor");
                                carType = $(this).html();
                            }else{
                                $carTypeSelected = null;
                                carType = null;
                            }

                            //调用查询方法
                            execute();
                        })

                        for(var i = 0;i<data.categories.length;i++){
                            //category.append("<td ><a class='showmoney'>"+data.categories[i].name+"</a></td>");
                            category.append("<li><a class='showmoney'>"+data.categories[i].name+"</a></li>")
                        }

                        $(".showmoney").click(function(){


                            if($moneySelected != null){
                                $moneySelected.removeClass("selectedColor");
                            }
                            if($moneySelected == null || $moneySelected.html() != $(this).html()){
                                $moneySelected = $(this);
                                $moneySelected.addClass("selectedColor");
                                money = $(this).html();
                            }else{
                                $moneySelected = null;
                                money = null;
                            }

                            execute();
                        })


                    }
                }
            })
            title = getParameter("content");
            execute();

        })

        /*
            title ：标题
            carBrandId ：品牌
            money ： 价格
            catType ： 类型
            age ： 用的年龄
            km ： 公里
            standard ： 排放标准
            displacement ： 排量
            gearbox ： 变速箱
            country ： 国别
            colour ： 颜色
            capabilities ： 能源
            pageCount ： 第几页
        */
        function announce(title,carBrand,money,carType,age,km,standard,displacement,gearbox,country,colour,capabilities,pageCount){

            var sendInfo = {
                title:title,
                carBrand:carBrand,
                money:money,
                carType:carType,
                age:age,
                km:km,
                standard:standard,
                displacement:displacement,
                gearbox:gearbox,
                country:country,
                colour:colour,
                capabilities:capabilities,
                pageCount:pageCount
            }

            $.ajax({
                // 编写json格式，设置属性和值
                url:"announce/seek",
                contentType:"application/json;charset=UTF-8",
                data:JSON.stringify(sendInfo),
                dataType:"json",
                type:"post",
                success:function(data){
                    if(data!=null){
                        $("#domain").empty();
                        for(var i = 0;i<data.announces.length;i++) {
                            $("#domain").append('<div class="col-sm-3"> '+
                                '<div class="thumbnail image-hover img-shadow-1"> '+
                                '<img class="product" src="'+data.announces[i].imgs[0].path+'"/> '+
                                '<p>'+data.announces[i].title+'</p> '+
                                '<font color="red">￥'+data.announces[i].money+'</font> '+
                                '<br/> '+
                                '<label class="gmai"> '+
                                '<p><a href="ShowShopping.html">查看详情</a></p> '+
                                '<button class="but2">购买</button> '+
                                '</label> '+
                                '</div> '+
                                '</div>');
                        }


                        $("#paging").empty();
                        var totalPage = Math.ceil(data.totalCount/12);

                        if(currentPage == 1)
                            $("#paging").append('<li class="page-item disabled"><a class="page-link" >上一页</a></li>');
                        else
                            $("#paging").append('<li class="page-item" onclick="execute('+(currentPage-1)+')" ><a class="page-link" >上一页</a></li>');

                        if(data.totalCount != 0){
                            var begin;
                            var end;
                            if(totalPage < 5 ){
                                begin = 1;
                                end = totalPage;
                            }else{
                                begin = currentPage - 2;
                                end = currentPage + 2;

                                if(begin <= 0){
                                    begin = 1;
                                    end = 5;
                                }

                                if(end > totalPage){
                                    begin = totalPage - 4;
                                    end = totalPage;
                                }

                            }

                            for(var i = begin;i<=end;i++){
                                if(currentPage == i)
                                    $("#paging").append('<li class="page-item active"><a class="page-link">'+i+'页</a></li>');
                                else
                                    $("#paging").append('<li class="page-item" onclick="execute('+(i)+')" ><a class="page-link">'+i+'页</a></li>');
                            }

                        }else{
                            $("#paging").append('<li class="page-item active"><a class="page-link" >1</a></li>');
                        }
                        if(currentPage == totalPage)
                            $("#paging").append('<li class="page-item disabled"><a class="page-link" >下一页</a></li>');
                        else
                            $("#paging").append('<li class="page-item" onclick="execute('+(currentPage+1)+')" ><a class="page-link" >下一页</a></li>');

                    }
                }

            });
        }

        function execute(pageCount){
            if(!pageCount)
                pageCount = 1;
            currentPage = pageCount;
            announce(title,carBrand,money,carType,age,km,standard,displacement,gearbox,country,colour,capabilities,pageCount);
        }



        function agefun(){
            age = $('select[id=ageSelect] option:selected').val();
            if(age==="null")
                age = null;
            execute();
        }
        function kmfun(){
            km = $('select[id=kmSelect]  option:selected').val();
            if(km==="null")
                km = null;
            execute();
        }
        function standardfun(){
            standard = $('select[id=standardSelect]  option:selected').val();
            if(standard==="null")
                standard = null;
            execute();
        }
        function displacementfun(){
            displacement = $('select[id=displacementSelect]  option:selected').val();
            if(displacement==="null")
                displacement = null;
            execute();
        }
        function gearboxfun(){
            gearbox = $('select[id=gearboxSelect]  option:selected').val();
            if(gearbox==="null")
                gearbox = null;
            execute();
        }
        function countryfun(){
            country = $('select[id=countrySelect]  option:selected').val();
            if(country==="null")
                country = null;
            execute();
        }
        function colourfun(){
            colour = $('select[id=colourSelect]  option:selected').val();
            if(colour==="null")
                colour = null;
            execute();
        }
        function capabilitiesfun(){
            capabilities = $('select[id=capabilitiesSelect]  option:selected').val();
            if(capabilities==="null")
                capabilities = null;
            execute();
        }

    </script>



</head>

<body>

<div>
    <table width="100%" class="tabe">
        <tr>
            <th><a href="index01.html" class="lin">Hi，欢迎来到汽车中心</a></th>
            <th><a href="#" class="lin">汽车检测</a></th>
            <th>
                <li class="dropdown">
                    <a href="#" class="dropdown-toggle lin" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">汽车维修<span class="caret"></span></a>
                    <ul class="dropdown-menu" >
                        <li><a href="#" class="wode">检测报告</a></li>
                        <li><a href="#" class="wode">维修价格</a></li>
                    </ul>
                </li>
            </th>
        </tr>
    </table>
</div>

<nav class="navbar navbar-default" id="nav">
    <div class="container-fluid">
        <div class="navbar-header layout">
            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false">
                <span class="sr-only"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <img id="logoId" src="img/logo.png" />
            <a class="leftFont" href="index02.html" id="oneCar">二手汽车</a>
            <a class="leftFont" href="index02.html" id="twoCar">智能汽车</a>
        </div>

        <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1" class="foonters">

            <form class="navbar-form" id="seek_form" >
                <div class="form-group ">
                    <input type="text" id="seekEditText" class="form-control" placeholder="查找" >
                </div>
                <button id="seekBtn" class="btn btn-default">搜索</button>
            </form>


            <ul class="nav navbar-nav navbar-right" id="login_right">
                <li id="dis1" style="display: none"><a href="login.html" class="lin">登录</a></li>
                <li id="dis2" style="display: none"><a href="register.html" class="lin">注册</a></li>
                <li class="dropdown">
                    <a id="dis3" style="display: none" href="#" class="dropdown-toggle lin" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">我的	<span class="caret"></span></a>
                    <ul class="dropdown-menu">
                        <li><a href="upload.html" class="wode">我要卖车</a></li>
                        <li><a href="shopCart.html" class="wode">购物车</a></li>
                    </ul>
                </li>
            </ul>

        </div>
    </div>
</nav>

<div style="display: none;" id="more">
    <div id="moreDiv">
    </div>
</div>


<div class="container-fluid" id="carouselDiv">


    <div id="leftMenu" >
        <div class="btn-group">
            <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                汽车品牌 <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" id="brand">

            </ul>
        </div>
        <div class="btn-group">
            <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                价格区间 <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" id="category" >

            </ul>
        </div>
        <div class="btn-group">
            <button class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                级别 <span class="caret"></span>
            </button>
            <ul class="dropdown-menu" id="type" >

            </ul>
        </div>

        <div class="btn-group">
            <button id="showOthers" class="btn btn-default btn-sm dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                其他 <span class="caret"></span>
            </button>
            <div id="others" >
                <table width="100%">
                    <tr class="choice">
                        <td class="sl">
                            <select id="ageSelect" onchange="agefun()">
                                <option value=null>车龄</option>
                                <option value="1年内">1年内</option>
                                <option value="2年内">2年内</option>
                                <option value="3年内">3年内</option>
                                <option value="3-5年">3-5年</option>
                                <option value="5-8年">5-8年</option>
                                <option value="8年以上">8年以上</option>
                            </select>
                        </td>
                        <td class="sl">
                            <select id="kmSelect" onchange="kmfun()">
                                <option value=null >里程</option>
                                <option value="1万公里">1万公里</option>
                                <option value="3万公里">3万公里</option>
                                <option value="5万公里">5万公里</option>
                                <option value="10万公里">10万公里</option>
                            </select>
                        </td>
                        <td class="sl">
                            <select id="standardSelect" onchange="standardfun()">
                                <option value=null>排放标准</option>
                                <option value="国一">国一</option>
                                <option value="国二">国二</option>
                                <option value="国三">国三</option>
                                <option value="国四">国四</option>
                                <option value="国五">国五</option>
                                <option value="国六">国六</option>
                            </select>
                        </td>
                        <td class="sl">
                            <select id="displacementSelect" onchange="displacementfun()">
                                <option value=null>排量</option>
                                <option value="1.0升以下">1.0升以下</option>
                                <option value="1.1-1.5升">1.1-1.5升</option>
                                <option value="1.6-2.0升">1.6-2.0升</option>
                                <option value="2.1-3.0升">2.1-3.0升</option>
                                <option value="3.1升以上">3.1升以上</option>
                            </select>
                        </td>
                        <td class="sl">
                            <select id="gearboxSelect" onchange="gearboxfun()">
                                <option value=null>变速箱</option>
                                <option value="手动">手动</option>
                                <option value="自动">自动</option>
                            </select>
                        </td>
                        <td class="sl">
                            <select id="countrySelect" onchange="countryfun()">
                                <option value=null>国别</option>
                                <option value="中国">中国</option>
                                <option value="美国">美国</option>
                                <option value="日本">日本</option>
                                <option value="日本">英国</option>
                                <option value="加拿大">加拿大</option>
                                <option value="韩国">韩国</option>
                                <option value="瑞士">瑞士</option>
                                <option value="墨西哥">墨西哥</option>
                                <option value="法国">法国</option>
                                <option value="德国">德国</option>
                                <option value="澳大利亚">澳大利亚</option>
                                <option value="瑞典">瑞典</option>
                                <option value="巴西">巴西</option>
                                <option value="意大利">意大利</option>
                            </select>
                        </td>
                        <td class="sl">
                            <select id="colourSelect" onchange="colourfun()">
                                <option value=null>颜色</option>
                                <option value="红色">红色</option>
                                <option value="黑色">黑色</option>
                                <option value="白色">白色</option>
                                <option value="香槟色">香槟色</option>
                                <option value="银色">银色</option>
                                <option value="咖啡色">咖啡色</option>
                                <option value="银灰色">银灰色</option>
                                <option value="紫色" >紫色</option>
                                <option value="黄色">黄色</option>
                            </select>
                        </td>
                        <td class="sl">
                            <select id="capabilitiesSelect" onchange="capabilitiesfun()">
                                <option value=null>能源</option>
                                <option value="汽油">汽油</option>
                                <option value="柴油">柴油</option>
                                <option value="油气混动">油气混动</option>
                                <option value="油电混动">油电混动</option>
                                <option value="纯电动">纯电动</option>
                                <option value="天然气">天然气</option>
                                <option value="插电混动">插电混动</option>
                            </select>
                        </td>
                    </tr>
                </table>
            </div>
        </div>
    </div>

    <div id="myCarousel" class="carousel slide imgSize" data-ride="carousel" align="center" style="display: inline-block;">

        <ol class="carousel-indicators">
            <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
            <li data-target="#myCarousel" data-slide-to="1"></li>
            <li data-target="#myCarousel" data-slide-to="2"></li>
        </ol>
        <div class="carousel-inner" role="listbox">
            <div class="item active">
                <img src="img/icon1.jpg" alt="...">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="img/icon2.jpg" alt="...">
                <div class="carousel-caption"></div>
            </div>
            <div class="item">
                <img src="img/icon3.jpg" alt="...">
                <div class="carousel-caption"></div>
            </div>
        </div>
    </div>

</div>


<div class="container" id="shoppingDomain">
    <div class="row jx" id="goods">
        <p class="toptit">最近热卖</p>

    </div>
    <div id="domain">


    </div>
</div>

<button id="btn"><img src="img/置顶图标.png" alt="置顶图标"/></button>
<footer class="text-center" id="pageId" >
    <ul class="pagination pagination-lg" id="paging">

    </ul>
</footer>


</body>
</html>
-->



<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>

<script>

    window.location.href = "index02.html";

</script>

<body>

</body>
</html>



